Jejak pengalaman belajar dan sharing IT saya, semua tertuang disini.
Jejak pengalaman belajar dan sharing IT saya, semua tertuang disini.
Materi belum tersedia
Materi belum tersedia
Materi belum tersedia
Materi belum tersedia
Materi belum tersedia
Materi belum tersedia
Materi belum tersedia
Materi belum tersedia
Mahasiswa mampu memahami konsep Blade Template pada Laravel, memahami struktur file Blade, menampilkan data pada Blade, menggunakan syntax dasar Blade, serta menerapkan layout dan template inheritance dalam pengembangan aplikasi web.
Laravel memiliki template engine bawaan bernama:
Blade digunakan untuk:
Blade membantu developer membuat tampilan yang:
Blade Template adalah template engine bawaan Laravel yang digunakan untuk membuat tampilan aplikasi web.
Blade memungkinkan developer:
Blade digunakan untuk:
| Keunggulan | Penjelasan |
|---|---|
| Syntax sederhana | Mudah dipahami |
| Ringan | Cepat diproses |
| Reusable layout | Template dapat digunakan ulang |
| Integrasi Laravel | Mendukung fitur Laravel |
Pada konsep MVC:
Controller
↓
Mengirim Data
↓
Blade Template
↓
HTML ditampilkan ke BrowserFile Blade berada pada folder:
resources/views/Format file:
.blade.phpContoh:
home.blade.phpresources/
└── views/
├── home.blade.php
├── about.blade.php
└── layouts/<!DOCTYPE html>
<html>
<head>
<title>Laravel</title>
</head>
<body>
<h1>Selamat Datang</h1>
</body>
</html>Route::get('/home', function () {
return view('home');
});public function index()
{
return view('home');
}Folder:
resources/views/layouts/digunakan untuk:
Data dari controller dapat dikirim ke Blade menggunakan:
public function index()
{
$nama = "Mahasiswa Laravel";
return view('home', compact('nama'));
}<h1>{{ $nama }}</h1>Syntax:
{{ }}digunakan untuk:
Controller:
public function index()
{
$nama = "Mahasiswa";
$kelas = "SI 4A";
return view('home', compact('nama', 'kelas'));
}Blade:
<h1>{{ $nama }}</h1>
<p>{{ $kelas }}</p>Controller:
$data = ['PHP', 'Laravel', 'MySQL'];
return view('home', compact('data'));Blade:
@foreach($data as $d)
<p>{{ $d }}</p>
@endforeachBlade secara otomatis:
Untuk mencegah:
Blade memiliki syntax khusus yang lebih sederhana dibanding PHP biasa.
{{ $nama }}@if($nilai >= 75)
<p>Lulus</p>
@else
<p>Tidak Lulus</p>
@endif@foreach($mahasiswa as $m)
<p>{{ $m }}</p>
@endforeach@for($i = 1; $i <= 5; $i++)
<p>{{ $i }}</p>
@endfor{{-- Ini komentar Blade --}}@include('navbar')Digunakan untuk:
| Syntax | Fungsi |
|---|---|
| {{ }} | Menampilkan data |
| @if | Percabangan |
| @foreach | Perulangan |
| @include | Memanggil file |
Layout adalah template utama yang digunakan bersama oleh banyak halaman.
Biasanya berisi:
Template inheritance digunakan agar:
File:
resources/views/layouts/app.blade.phpIsi:
<!DOCTYPE html>
<html>
<head>
<title>Laravel</title>
</head>
<body>
<h1>Header Website</h1>
@yield('content')
<footer>
Footer Website
</footer>
</body>
</html>@yield('content')Digunakan untuk:
File:
resources/views/home.blade.phpIsi:
@extends('layouts.app')
@section('content')
<h2>Halaman Home</h2>
@endsection| Syntax | Fungsi |
|---|---|
| @extends | Menggunakan layout |
| @section | Mengisi section |
| @yield | Tempat konten tampil |
| Keuntungan | Penjelasan |
|---|---|
| Kode lebih rapi | Tidak duplikasi HTML |
| Mudah maintenance | Edit layout sekali |
| Konsisten | Tampilan seragam |
layouts/
├── app.blade.php
├── navbar.blade.php
├── footer.blade.phpBuat file:
resources/views/home.blade.phpIsi:
<h1>Belajar Blade Laravel</h1>Controller:
public function index()
{
$nama = "Laravel";
return view('home', compact('nama'));
}Blade:
<h1>{{ $nama }}</h1>@foreach($data as $d)
<p>{{ $d }}</p>
@endforeachFile:
layouts/app.blade.phpGunakan:
Blade Template pada Laravel mempermudah developer dalam membuat tampilan website yang dinamis, rapi, dan reusable. Dengan memahami struktur file Blade, syntax dasar, serta layout dan template inheritance, mahasiswa dapat membangun antarmuka aplikasi Laravel yang lebih profesional dan terorganisir.